﻿<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>转码管理</title>
    <link href="http://g.alicdn.com/sj/dpl/1.5.1/css/sui.min.css" rel="stylesheet">
    <style type="text/css">
        .ms-controller {
            visibility: hidden;
        }
    </style>
</head>
<body ms-controller="listview" class="ms-controller">
    <div class="sui-container" style="width:98%">
        <div class="sui-form form-inline" style="padding-top:5px;">
            

            <input type="text" ms-duplex="@searchkey" placeholder="关键字搜索" class="input-large input-xfat" />
            <a class="sui-btn btn-large btn-primary" style="margin-left:10px;" ms-click="@GetLIST()">查询</a>
            <a style="margin-left:10px;" class="sui-btn btn-large btn-success" ms-click="@ADD('')">添加</a>
        </div>

        <table class="sui-table table-primary table-zebra">
            <thead>
                <tr>
                    <th>视频类型</th>
                    <th>原始视频</th>
                    <th>切片标题</th>
                    <th>分类</th>
                    <th>切片开始时间</th>
                    <th>切片结束时间</th>
                    <th>切片时长</th>
                    <th>图片</th>
                    <th>状态</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr ms-for="el in @ListData">
                    <td>{{@ShowType(el.VideoType)}}</td>
                    <td>{{el.SourceName}}</td>
                    <td>{{el.Title}}</td>
                    <td>{{el.TypeName}}</td>
                    <td>{{el.TimeStart}}</td>
                    <td>{{el.TimeEnd}}</td>
                    <td>{{el.TimeLength}}</td>
                    <td>{{el.ImgUrl}}</td>
                    <td>{{el.Status}}</td>
                    <td>
                        <a href="javascript:void(0);" class="sui-btn btn-bordered btn-success" style="margin:3px;" ms-click="@ADD(el)">编辑</a>
                        <a href="javascript:void(0);" class="sui-btn btn-bordered btn-danger" ms-click="@delitem(el)">删除</a>

                    </td>
                </tr>
            </tbody>
        </table>

        <div id="pageDiv"></div>
        <div class="sui-form form-inline" style="margin-top:20px;">
            <div class="sui-msg msg-large msg-success">
                <div class="msg-con">总数据：{{@total}}</div>
                <s class="msg-icon"></s>
            </div>
        </div>




    </div>


    <script type="text/javascript" src="http://g.alicdn.com/sj/lib/jquery/dist/jquery.min.js"></script>
    <script type="text/javascript" src="http://g.alicdn.com/sj/dpl/1.5.1/js/sui.min.js"></script>
    <script src="//cdn.bootcss.com/avalon.js/2.1.8/avalon.js"></script>
    <script src="/admin/js/layer/layer.js"></script>
    <script src="/admin/js/ComFunJS.js?v=20170808"></script>

    <script type="text/javascript">
        var model = avalon.define({
            $id: "listview",
            searchkey: "",
            page: { pageindex: 1, pagesize: 10 },
            ListData: [],
            total: 0,
            GetLIST: function () {
                model.page.pageindex = 1;
                model.ListData.clear();
                $.getJSON("/adapi/video/zmlist", { pageindex: model.page.pageindex, pagesize: model.page.pagesize, key: model.searchkey }, function (r) {
                    if (r.error == "") {
                        model.ListData = r.result;
                        model.total = r.total;

                        $("#pageDiv").pagination({  //分页容器
                            styleClass: ['sui-pagination'],  //分页样式
                            //showCtrl: false,
                            displayPage: 6,
                            itemsCount: r.total,
                            pageSize: model.page.pagesize,
                            onSelect: function (num) {
                                model.page.pageindex = num;
                                $.getJSON("/adapi/video/zmlist", { pageindex: model.page.pageindex, pagesize: model.page.pagesize, key: model.searchkey }, function (r) {
                                    model.ListData.clear();
                                    model.ListData = r.result;
                                })
                            }
                        })

                        $('#pageDiv').pagination('updateItemsCount', r.total, 1);
                    }
                })

            },
            delitem: function (el) {
                if (el) {
                    top.ComFunJS.winShowConfirm("<span style='color:red;'>确定要删除吗?<span>", function () {
                        $.getJSON("/adapi/video/zmdel/" + el.ID, function (r) {
                            if (r.error == "") {
                                top.ComFunJS.winShowMsg("操作成功");
                                model.ListData.remove(el);
                            } else {
                                top.ComFunJS.winShowAlert(r.error);
                            }
                        })

                    })
                }
            },
            ADD: function (el) {
                if (el) {
                    top.ComFunJS.winShowForm("/admin/base/add.html?funcode=zminfo&ID=" + el.ID, "修改");
                } else {
                    top.ComFunJS.winShowForm("/admin/base/add.html?funcode=zminfo", "添加");
                }
            },
            ShowType: function (type) {
                if (type) {
                    if (type == "1") {
                        return "分类视频";
                    } else if (type == "2") {
                        return "华豫学院";
                    }
                }

            }
        })

        avalon.ready(function () {

           model.GetLIST();

        })

        //model.$watch("InfoType", function () {
        //    model.modelData.InfoType = model.InfoType;
        //    model.GetLIST();
        //})
    </script>
</body>
</html>
